<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>短信平台</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" th:href="@{/vendor/bootstrap/css/bootstrap.min.css}">
    <!-- Font Awesome CSS-->
    <link rel="stylesheet" th:href="@{/vendor/font-awesome/css/font-awesome.css}">
    <!-- Fontastic Custom icon font-->
    <link rel="stylesheet" th:href="@{/css/fontastic.css}">
    <!-- Google fonts - Roboto -->
    <!--<link rel="stylesheet" th:href="@{https://fonts.googleapis.com/css?family=Roboto:300,400,500,700}">-->
    <!-- jQuery Circle-->
    <link rel="stylesheet" th:href="@{/css/grasp_mobile_progress_circle-1.0.0.min.css}">
    <!-- theme stylesheet-->
    <link rel="stylesheet" th:href="@{/css/style.blue.css}" id="theme-stylesheet">
    <!-- Custom stylesheet - for your changes-->
    <link rel="stylesheet" th:href="@{/css/custom.css}">
    <!-- Favicon-->
    <link rel="shortcut icon" th:href="@{/img/favicon.ico}">
    <!-- Tweaks for older IEs--><!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->
    <meta name="_csrf" th:content="${_csrf.token}"/>
    <meta name="_csrf_header" th:content="${_csrf.headerName}"/>
</head>
<!-- JavaScript files-->
<script type="text/javascript" th:src="@{/js/jquery.js}"></script>
<script type="text/javascript" th:src="@{/vendor/popper.js/umd/popper.min.js}"></script>
<script th:src="@{/vendor/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/vendor/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.concat.min.js}"></script>
<script th:src="@{/js/grasp_mobile_progress_circle-1.0.0.min.js}"></script>
<script th:src="@{/vendor/jquery.cookie/jquery.cookie.js}"></script>

<script language="javascript" type="text/javascript" th:src="@{/My97DatePicker/WdatePicker.js}"></script>
<!-- Main File-->
<script th:src="@{/js/front.js}"></script>
<script th:src="@{/js/base.js}"></script>
<script type="text/javascript">

</script>
<body>
<!-- Side Navbar -->
<div th:replace="~{/pages/common/side_navbar.html}"></div>
<div class="page">
    <!-- navbar-->
    <div th:replace="~{/pages/common/header_navbar.html}"></div>

    <!--页码代码-->
    <!-- Breadcrumb-->
    <div class="breadcrumb-holder">
        <div class="container-fluid">
            <ul class="breadcrumb">
                <li class="breadcrumb-item"><a href="#">审计管理</a></li>
                <li class="breadcrumb-item active">日志查询</li>
            </ul>
        </div>
    </div>
    <section>
        <div class="container-fluid">
            <!-- Page Header-->
            <div class="row">
                <div class="col-lg">
                    <div class="card">
                        <div class="card-header">
                            <h4>日志列表</h4>
                        </div>

                        <div class="col-lg-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-center">
                                    <h4>查询</h4>
                                </div>
                                <div class="card-body">
                                    <form class="form-inline" th:action="@{/sys/log/list}" method="post">
                                        <div class="form-group col-lg-4 mb-3">
                                            <label for="userName" class="col-lg-3 col-sm-3 mr-3">用户名</label>
                                            <input id="userName" type="text" placeholder="" name="userName"
                                                   th:value="${userName}"
                                                   class="mr-3 col-lg-7 col-sm-7 form-control">
                                        </div>
                                        <div class="form-group col-lg-4 mb-3">
                                            <label for="operation" class="col-lg-3 col-sm-3 mr-3">日志类型</label>
                                            <select id="operation" name="operation"
                                                    class="mr-3 col-lg-7 col-sm-7 form-control">
                                                <option value="">请选择</option>
                                                <div th:each="operationDict:${operationDicts}">
                                                    <option th:value="${operationDict.dictValue}"
                                                            th:text="${operationDict.dictName}"
                                                            th:selected="${operationDict.dictValue.equals(operation+'') }">
                                                    </option>
                                                </div>
                                            </select>
                                        </div>
                                        <div class="form-group col-lg-4 mb-3">
                                            <label for="operationDesc" class="col-lg-3 col-sm-3 mr-3">日志内容</label>
                                            <input id="operationDesc" type="text" placeholder="" name="operationDesc"
                                                   th:value="${operationDesc}"
                                                   class="mr-3 col-lg-7 col-sm-7 form-control">
                                        </div>
                                        <div class="form-group col-lg-4 mb-3">
                                            <label for="result" class="col-lg-3 col-sm-3 mr-3">执行结果</label>
                                            <select id="result" name="result"
                                                    class="mr-3 col-lg-7 col-sm-7 form-control">
                                                <option value="">请选择</option>
                                                <option value="1" th:selected="${ 1 == result }">成功</option>
                                                <option value="0" th:selected="${ 0 == result }">失败</option>
                                            </select>
                                        </div>
                                        <div class="form-group col-lg-4 mb-3">
                                            <label class="col-lg-3 col-sm-3 mr-3">开始时间</label>
                                            <input type="text" id="startDate" name="startDate"
                                                   style="background-color: white !important;"
                                                   class="Wdate mr-3 col-sm-7 form-control "
                                                   onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'endDate\')}'})"
                                                   th:value="${startDate}" readonly unselectable="on"/>

                                        </div>
                                        <div class="form-group col-lg-4 mb-3">
                                            <label class="col-lg-3 col-sm-3 mr-3">结束时间</label>
                                            <input type="text" id="endDate" name="endDate"
                                                   style="background-color: white !important;"
                                                   class=" Wdate mr-3 col-sm-7 form-control "
                                                   onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startDate\')}'})"
                                                   th:value="${endDate}" readonly unselectable="on"/>
                                        </div>
                                        <div class="form-group col-lg-8 mb-3">
                                        </div>

                                        <div class="form-group col-lg-4 mb-3 " style="padding-left: 10%">
                                            <input type="submit" value="查询"
                                                   class="mr-3 btn btn-primary">
                                            <input type="button" value="重置"
                                                   class="  mr-3 btn btn-success fromReset">
                                            <input type="button" value="导出"
                                                   class=" mr-3 btn btn-info export">
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <!--tables start -->
                        <div class="col-lg-12 grid-margin stretch-card">
                            <div class="card">
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-striped table-bordered">
                                            <thead>
                                            <tr>
                                                <th class="text-center">序号</th>
                                                <th class="text-center">用户名</th>
                                                <th class="text-center">登录名称</th>
                                                <th class="text-center">IP地址</th>
                                                <th class="text-center">日志类型</th>
                                                <th class="text-center">日志内容</th>
                                                <th class="text-center">结果</th>
                                                <th class="text-center">备注</th>
                                                <th class="text-center">操作时间</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr th:each="data,loop:${data.content}">
                                                <th scope="row" th:text="${loop.count}"></th>
                                                <td th:text="${data.userName}"></td>
                                                <td th:text="${data.loginName}"></td>
                                                <td th:text="${data.ipAddress}"></td>
                                                <td th:text="${@dict.getDictName(__${data.operation}__,'sysLogOperation')}">
                                                <td th:text="${data.operationDesc}">
                                                    <!--服务状态-->
                                                <td th:if="${1 == data.operationResult}">
                                                    <span class="fa fa-circle" style="color:green;">成功</span>
                                                </td>
                                                <td th:if="${0 == data.operationResult}">
                                                    <span class="fa fa-circle" style="color:red;">失败</span>
                                                </td>
                                                <td th:text="${data.operationRemark}"></td>
                                                <td th:text="${#dates.format(data.createTime,'yyyy-MM-dd HH:mm:ss')}"></td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="col-lg-6 float-none float-sm-left">
                                        <small th:text="'共'+${data.totalElements}+'条记录，每页'+${data.size}+'条,共'+${data.totalPages}+'页'"></small>
                                    </div>
                                    <div th:replace="~{/pages/common/pagination.html :: page(${data.number}+1, ${data.totalPages}, ${url}, 'currentPage') }"></div>
                                </div>
                            </div>
                        </div>
                        <!--tables end -->
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--页码-->
    <div th:replace="~{/pages/common/foot.html}"></div>
</div>

</body>
<script type="text/javascript">
    /*设置默认首页 调整菜单选中*/
    $(function () {
        debugger;
        var menuCheck = sessionStorage.getItem("menuCheckedId");
        var menuSubCheck = sessionStorage.getItem("menuSubCheckedId");
        var hasSub = sessionStorage.getItem("hasSub");
        //清除原来样式
        if (menuSubCheck != '8a808ed072feab9e0172feaffd8b0001') {
            if (hasSub == 0) {
                $('#' + menuCheck).removeAttr("style", "");
            } else {
                var $menu = $('#' + menuCheck);
                $menu.attr("aria-expanded", false);
                $menu.nextAll().addClass("hide")
                console.log("subId=" + menuSubCheck);
                $('#' + menuSubCheck).removeAttr("style", "");
            }
            sessionStorage.setItem("menuCheckedId", "8a808ec172d9a8ef0172d9ba70970000");
            sessionStorage.setItem("menuSubCheckedId", "8a808ed072feab9e0172feaffd8b0001");
            sessionStorage.setItem("hasSub", 1);
            var $menu = $('#8a808ec172d9a8ef0172d9ba70970000');
            $menu.attr("aria-expanded", true);
            $menu.nextAll().addClass("show")
            $('#8a808ed072feab9e0172feaffd8b0001').attr("style", "background-color:#28a745");
        }

    })


</script>
<script type="text/javascript">
    $(function () {
        $(".fromReset").on('click', function () {
            $("#userName").val("")
            $("#operation").val("")
            $("#operationDesc").val("");
            $("#result").val("");
            $("#startDate").val("")
            $("#endDate").val("")
            window.location.href = $appName + "/sys/log/list";
        });
        $(".export").on('click', function () {
            window.location.href=$appName + "/sys/log/exportLog";
        })
    })
</script>
</html>